<template>
  <div class="synbox">
    <header>
      <van-nav-bar title="系统通知" left-arrow @click-left="$router.back()" />
    </header>
    <main>
      <dl class="notice">
        <dt class="rou">
          <img src="../../assets/img/imggg_03.png" alt="" />
        </dt>
        <dd class="title">
          <ul>
            <li>感谢使用【妙手医生】服务!</li>
            <li>挂号、问诊、购药，上妙手医生!</li>
            <li class="xingxing"><img src="../../assets/img/星星.png" alt=""
                style="width: 40px;height: 40px;margin-right: 5px;">
              <p>近期热门推荐</p>
            </li>
            <li><img src="../../assets/img/向右_右箭头.png" alt="" class="youjian">名医直播义诊，医生与你面对面</li>
            <li><span class="icon"><img src="../../assets/img/ys_07.png" alt=""></span><span
                style="cursor: pointer;color: #2ba5fb;" @click="$router.push('/medic')">点此进入！</span></li>
            <li class="xingxing"><img src="../../assets/img/星星.png" alt=""
                style="width: 40px;height: 40px;margin-right: 5px;">
              <p>我们提供便捷的就医服务</p>
            </li>
            <li>我要<span class="icon"><img src="../../assets/img/ys_07.png" alt=""></span><span
                style="cursor: pointer;color: #2ba5fb;">预约挂号</span></li>
            <li>我要<span class="icon"><img src="../../assets/img/ys_07.png" alt=""></span><span
                @click="$router.push('/interrogation')" style="cursor: pointer;color: #2ba5fb;">极速问诊</span></li>
            <li>我要<span class="icon"><img src="../../assets/img/ys_07.png" alt=""></span><span
                style="cursor: pointer;color: #2ba5fb;" @click="$router.push('/more')">专家问诊</span></li>
            <li class="xingxing"><img src="../../assets/img/星星.png" alt=""
                style="width: 40px;height: 40px;margin-right: 5px;">
              <p>您的专属服务</p>
            </li>
            <li><span class="icon"><img src="../../assets/img/ys_07.png" alt=""></span><span
                style="cursor: pointer;color: #2ba5fb;" @click="$router.push('/service')">我的医生</span></li>
            <li><span class="icon"><img src="../../assets/img/ys_07.png" alt=""></span><span
                style="cursor: pointer;color: #2ba5fb;" @click="$router.push('/mywz')">我的问诊记录</span></li>
            <li><span class="icon"><img src="../../assets/img/ys_07.png" alt=""></span><span
                style="cursor: pointer;color: #2ba5fb;" @click="$router.push('/restoratives')">我的用药记录</span></li>
            <li><span class="icon"><img src="../../assets/img/ys_07.png" alt=""></span><span
                style="cursor: pointer;color: #2ba5fb;" @click="$router.push('/register')">我的挂号记录</span></li>
          </ul>
        </dd>
      </dl>
    </main>
  </div>
</template>
<script lang="ts" setup>

</script>
<style lang="scss" scoped>
.synbox {
  width: 100%;
  height: 1334px;
  background-color: #eff0f2;
  padding: 0 20px;
}

.notice {
  width: 100%;
  height: 100%;
}

.rou {
  width: 30px;
  height: 30px;
  float: left;
  margin-top: 20px;
}

.rou img {
  border-radius: 70%;
}

.title {
  padding: 20px 20px;
  width: 75%;
  height: 60%;
  /* letter-spacing: 10px; */
  float: left;
  margin-left: 80px;
  margin-top: 50px;
  background-color: rgb(252, 252, 252);
  border-radius: 15px;
  font-size: 30px;
}

.icon {
  font-size: 50px;
  color: #ccc;
}

.icon img {
  width: 30px;
  height: 30px;
}

.xingxing {
  display: flex;
  margin-top: 20px;
  margin-bottom: 10px;
}

.youjian {
  color: #ccc;
  width: 30px;
  height: 30px;
  margin-right: 10px;
}
</style>
